<link rel="import" href="/bower_components/paper-button/paper-button.html">
<link rel="import" href="/bower_components/paper-tooltip/paper-tooltip.html">
<link rel="import" href="/bower_components/polymer/polymer.html">


<dom-module id="display-test-disablement-item">
  <template>
    <style>
      td {
        padding: 2px;
        padding-right: 10px;
        height: 50px;
        vertical-align: top;
        overflow:hidden;
        text-overflow:ellipsis;
        text-align: left;
      }

    </style>
      <td>[[disabled_test.normalized_test_name]]</td>
      <td>
          <template is="dom-repeat" items="{{disabled_test.disabled_test_variants}}" as="disabled_test_variant">
            <ul>
              <li>
                [[disabled_test_variant]]
              </li>
            </ul>
        </template>
      </td>
      <td>
        <template is="dom-if" if="[[hasBug(disabled_test)]]">
          <template is="dom-repeat" items="[[disabled_test.issues]]" as="bug">
            <ul>
              <li>
                <a href="[[bug.issue_link]]">[[bug.issue_id]]</a>
              </li>
            </ul>
          </template>
        </template>
        <template is="dom-if" if="[[!hasBug(disabled_test)]]">
          <td>None</td>
        </template>
      </td>
    </template>

  <script src="../../js/common.js"></script>
  <script>
    (function () {
      "use strict";

      Polymer({
        is: "display-test-disablement-item",
        properties: {
          disabled_test: {
            type: Object
          },
        },

        hasBug: function (disabled_test) {
         return (disabled_test.issues && disabled_test.issues.length > 0);
        },

      });
    })();
  </script>
</dom-module>
